<!-- 基本信息 -->
<template>
	<a-list :split="false" size="small" style="margin-left: 30px;" :dataSource="listData">
    <a-list-item slot="renderItem" slot-scope="item, index">
			<span class="mr10" style="font-weight: bold;">{{item.title}}</span>
			{{item.info}}
		</a-list-item>
  </a-list>
</template>

<script>
import { mapState, mapActions } from 'vuex';

export default {
  name: 'BasicInfo',
  data() {
    return {
      listData: [
        // {title: '用户名称:', info: ''},
        // {title: '用户角色:', info: ''},
        // // {title: '所属群组:', info: ''},
        // {title: '用户姓名:', info: ''},
        // {title: '用户邮箱:', info: ''},
        // {title: '用户手机:', info: ''},
        // {title: '用户微信:', info: ''},
        // {title: '用户单位:', info: ''},
        // {title: '单位地址:', info: ''},
        // {title: '关联设备:', info: ''},
        // {title: '激活状态:', info: ''},
        // {title: '注册时间:', info: ''},
        // {title: '登录记录:', info: ''},
      ],
    };
  },
  computed: {
        	...mapState({
        		userDetail: state => state.UserBasicInfo.UserDetail,
        	}),
  },
  watch: {
    userDetail() {
      console.log(this.userDetail);
      this.getData();
    },
  },
  mounted() {
    this.userDetailFun().then((response) => {
      this.getData();
    });
  },
  methods: {
    ...mapActions({
      userDetailFun: 'UserBasicInfo/userDetail', // 基本信息
    }),
    getData() {
      this.listData = [
        { title: '用户名称:', info: this.userDetail.username },
        { title: '用户角色:', info: this.userDetail.role_name },
        // {title: '所属群组:', info:'（该值待对接）'},
        { title: '用户姓名:', info: this.userDetail.name == null ? '（未填写）' : this.userDetail.name },
        { title: '用户邮箱:', info: this.userDetail.email == null ? '（未填写）' : this.userDetail.email },
        { title: '用户手机:', info: this.userDetail.phone == null ? '（未填写）' : this.userDetail.phone },
        // {title: '用户微信:', info:'（未绑定。。。。未对接）'},
        { title: '用户单位:', info: this.userDetail.company_name == null || this.userDetail.company_name == '' ? '（未填写）' : this.userDetail.company_name },
        // {title: '单位地址:', info: this.userDetail.company_address == null ? '（未填写）' : this.userDetail.company_address},
        // {title: '关联设备:', info: this.userDetail.associated_device == null ? '（未关联）' : this.userDetail.associated_device},
        { title: '激活状态:', info: `${this.userDetail.activation_status}` },
        { title: '小程序绑定状态:', info: this.userDetail.wx_openid_status },
        { title: '公众号绑定状态:', info: this.userDetail.gz_openid_status },
        { title: '注册时间:', info: this.userDetail.created_at },
        { title: '登录记录:', info: this.userDetail.login_time },
      ];
    },
  },
};
</script>

<style scoped>

</style>
